<template>
  <div>
    <el-timeline :reverse="reverse">
      <el-timeline-item v-for="(item, index) in dataList" :key="index"
                        type="primary"
                        size="large"
                        :timestamp="item.operTime">
        {{ (item.operBy ? '【' + item.operBy + '】' : "") + item.operDesc }}
        <el-card shadow="hover" v-if="item.remark">
          <span style="color: #000;font-weight: bold;">描述：</span>{{item.remark}}
        </el-card>
      </el-timeline-item>
    </el-timeline>
  </div>
</template>

<script>
import {deleteAction, getAction} from '@/api/manage'
import ProcessPleaseBuyForm from '@/views/develop/process/processPleaseBuy/module/ProcessPleaseBuyForm'

export default {
  name: "ProcessPleaseBuyTimeline",
  components: {
  },
  props:{
    pleaseBuyId: {
      type: String,
      required: true
    },
  },
  watch:{
    pleaseBuyId: {
      handler(val) {
        if(val){
          this.queryParams.pleaseBuyId= val;
          this.getList();
        }
      },
      immediate: true,
    },
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      reverse: false,
      // 请购单操作记录表格数据
      dataList: [],
      // 查询参数
      queryParams: {
        pleaseBuyId : this.pleaseBuyId,
        pageSizeZero : true,
        orderByColumn :"oper_time",
        isAsc :"ascending",
      },
      url: {
        list: '/processPleaseBuy/processPleaseBuy/list',
      },
      tableMaxHeight: window.innerHeight - 320,
    };
  },
  created() {
    window.addEventListener('resize', this.getTableHeight);
  },
  destroyed() {
    window.removeEventListener('resize', this.getTableHeight)
  },
  methods: {
    /** 查询请购单操作记录列表 */
    getList() {
      this.loading = true;
      this.dataList= [];
      getAction(this.url.list, this.queryParams).then(response => {
        this.dataList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    getTableHeight() {
      this.tableHeight = window.innerHeight - 320
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },

  }
};
</script>
